{% extends "admin/base_site.html" %}
{% block content %}
<style>
.amazon-auth-modal-bg {
    position: fixed; left: 0; top: 0; width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.35); z-index: 9999;
}
.amazon-auth-modal {
    position: fixed; left: 0; top: 0; width: 100vw; height: 100vh;
    display: flex; align-items: center; justify-content: center; z-index: 10000;
}
.amazon-auth-box {
    background: #fff; border-radius: 8px; box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    padding: 32px 40px; min-width: 400px; max-width: 90vw;
}
.amazon-auth-title {
    font-size: 20px; font-weight: bold; margin-bottom: 16px; display: flex; align-items: center;
}
.amazon-auth-title .icon {
    color: #faad14; font-size: 24px; margin-right: 8px;
}
.amazon-auth-form label { margin-right: 16px; }
.amazon-auth-warning {
    color: #faad14; background: #fffbe6; border: 1px solid #ffe58f;
    padding: 8px 12px; border-radius: 4px; margin-top: 16px; font-size: 13px;
}
.amazon-auth-btns {
    margin-top: 24px; text-align: right;
}
.amazon-auth-btns button {
    min-width: 80px; padding: 6px 18px; font-size: 15px; border-radius: 4px; border: none;
}
.amazon-auth-btns .btn-cancel { background: #fff; border: 1px solid #d9d9d9; margin-right: 16px; }
.amazon-auth-btns .btn-go { background: #1890ff; color: #fff; }
.auth-form-label { display:inline-block; min-width:60px; }
.select-multi {
    min-width: 220px;
    padding: 6px 8px;
    border: 1px solid #d9d9d9;
    border-radius: 4px;
    font-size: 15px;
    margin-left: 4px;
}
</style>
<div class="amazon-auth-modal-bg"></div>
<div class="amazon-auth-modal">
  <div class="amazon-auth-box">
    <div class="amazon-auth-title">
      <span class="icon">⚠️</span>
      跳转亚马逊后台授权？
    </div>
    <div style="margin-bottom: 16px; color: #666;">
      点击前往将跳转至亚马逊后台，跳转亚马逊后台后请进行相应授权操作，请确保在常用环境下操作，避免失联。
    </div>
    <form method="post" class="amazon-auth-form">
      {% csrf_token %}
      <div style="margin-bottom: 10px;">
        <span class="auth-form-label"><b>账号名：</b></span>{{ account_name }}
      </div>
      <div style="margin-bottom: 10px;">
        <span class="auth-form-label"><b>区域：</b></span>{{ region }}
      </div>
      <div style="margin-bottom: 10px;">
        <span class="auth-form-label"><b>站点：</b></span>
        <select name="sites" class="select-multi" multiple size="6">
          {% for value, name in all_sites %}
          
            <option value="{{ value }}" {% if value in selected_sites %}selected{% endif %}>{{ name }}</option>
          {% endfor %}
        </select>
      </div>
      <div class="amazon-auth-warning">
        <b>点击登录亚马逊边缘授权将跳转到亚马逊卖家后台，请在常用环境下操作，避免失联。</b>
      </div>
      <div class="amazon-auth-btns">
        <button type="submit" name="cancel" class="btn-cancel">取消</button>
        <button type="submit" name="go" class="btn-go">前往</button>
      </div>
    </form>
  </div>
</div>
{% endblock %}
